<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>设计京东商业导购的页面</title>
        <style>
            .div0{
                width: 720px;
                height: 600px;
                border: 1px solid #0099FF;
                margin: 0 auto;
				text-align: center;
            }
            img{
                width: 186px;
                height: 205px;
            }
			h3{
				text-align: center;
				font-size: 32px;
				color: red;
			}
			.div1,.div2,.div3,.div4,.div5,.div6{
				margin: 10px;
				border: 1px double #99c;
				float: left;
				text-align: center;
				vertical-align: center;
				width: 208px;
				height: 225px;
			}
			div a img{
				border: 10px groove #99c;
			}
			div a:hover img{
				border: 10px dashed #99c;
			}

        </style>
	</head>
	<body>
		<div class="div0">
			<h3>京东商城导购</h3>
			<div class="div1">
				<a href="#"><img src="../img/image41-1.jpg" alt="" /></a>
			</div>
			<div class="div2">
				<a href="#"><img src="../img/image41-2.jpg" alt="" /></a>
			</div>
			<div class="div3">
				<a href="#"><img src="../img/image41-3.jpg" alt="" /></a>
			</div>
			<div class="div4">
				<a href="#"><img src="../img/image41-4.jpg" alt="" /></a>
			</div>
			<div class="div5">
				<a href="#"><img src="../img/image41-5.jpg" alt="" /></a>
			</div>
			<div class="div6">
				<a href="#"><img src="../img/image41-6.jpg" alt="" /></a>
			</div>
		</div>
	</body>
</html>
